<script setup lang="ts">
defineProps<{
  type: 'expense' | 'income'
  title: string
  time: string
  price: string
}>()
</script>

<template>
  <view class="flex items-center justify-between p-40rpx">
    <view class="flex-auto">
      <view class="text-28rpx text-#333333 font-medium leading-40rpx">
        {{ title }}
      </view>
      <Spacer h="12" />
      <view class="text-28rpx text-#BDBDBD font-medium leading-40rpx">
        {{ time }}
      </view>
    </view>
    <view class="ml-52rpx flex-none text-32rpx font-medium leading-45rpx" :class="type === 'expense' ? 'text-#FA662F' : 'text-#3F8BF6'">
      {{ `${type === 'expense' ? '-' : '+'}¥${price}` }}
    </view>
  </view>
</template>
